<template>
    <view>
        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-button type="danger" :icon="Edit" @click="handleEdit" v-isAdmin>修改</el-button>
            </el-col>
        </el-row>
        <a-row :gutter="24">
            <a-col :span="24" :lg="16"  class="mb-24">
                <CountCard title="订单总额"  prefix="￥" suffix=""  :value="order?.amount">

                </CountCard>
            </a-col>
            
        </a-row>
        <a-row :gutter="24">
            <a-col :span="24" :lg="16"  class="mb-24">
                <CountCard title="已付金额"  prefix="￥" suffix="" :value="order?.receivedAmount">

                </CountCard>
            </a-col>
            
        </a-row>
        <el-dialog title="金额修改" v-model="open" width="500px" append-to-body>
            <el-form ref="formRef" :model="form"  label-width="80px">
                
                <el-form-item label="订单总额" prop="amount">
                    <el-input-number v-model="form.amount" controls-position="right" :min="0" />
                </el-form-item>
                <el-form-item label="已付金额" prop="receivedAmount">
                    <el-input-number v-model="form.receivedAmount" controls-position="right" :min="0" />
                </el-form-item>
                <el-form-item label="备注">
                    <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
                </el-form-item>
            </el-form>

            <template #footer>
                <div class="dialog-footer">
                    <el-button type="primary" @click="submitForm">确 定</el-button>
                    <el-button @click="open = false">取 消</el-button>
                </div>
            </template>
        </el-dialog>
    </view>
</template>
<script setup>
import emitter from '@/utils/mitt';
import { UploadFilled, Avatar, Delete, VideoPlay, Edit, Plus, Search, Refresh, Unlock, Lock, Files } from '@element-plus/icons-vue'
import { queryList, createOne, updateOne, deleteOne } from "@/custom/pms/api/order";
import useUserStore from '@/store/modules/user';
const userStore = useUserStore();
import useApp from '@/hooks';
const { $, proxy } = useApp();
const form = ref({});
const open = ref(false);
const props = defineProps({
    order: {
        type: [Object]
    }
});
function handleEdit(){
    form.value = props.order;
    open.value = true;
    
}
function submitForm(){
    updateOne(form.value).then(res=>{
        $.showToast({
            title:'更新成功',
            icon:'success'
        })
        open.value = false;
        emitter.emit('do-update',props.order.id);
    })
}
</script>